<template>
  <div style="margin: 300px;">
    <div>{{ counter.count }}</div>
    <div>{{ title }}</div>
    <div>{{ book.price }}</div>
    <div>{{ testCount }}</div>
    <button @click="handleClick">点击改变世界</button>
  </div>
</template>

<script setup lang="ts">
import { storeToRefs } from "pinia";
import { testStore } from "./pinia/TestStore";
const counter = testStore();
let { title, book,testCount } = storeToRefs(counter); // 类似于vue3的ref()
const handleClick = () => {
  counter.increment();
  title.value = "Hello, Word!";
  book.value.price = 9.99
  counter.book.price = 10.00
};
</script>
